<template>
	<view>
		<!-- #ifdef APP-PLUS -->
		<Hearder :name="'个人详情'"></Hearder>
		<!-- #endif -->
		<view class="v_one" v-if="JSON.stringify(info) !='{}'">
			<view class="v_two">
				<view>{{info.statistics.register_num}}</view>
				<view>注册人数</view>
			</view>
			<view class="v_two">
				<view>{{info.statistics.perfect_num}}</view>
				<view>信息完善人数</view>
			</view>
			<view class="v_two">
				<view>{{info.statistics.activate_num}}</view>
				<view>激活人数</view>
			</view>
		</view>
		<view style="padding: 0rpx 3% 24rpx;" v-if="JSON.stringify(info) !='{}'">
			<view class="f_one">
				<view class="r_five">
					<view>
						<image class="five_img" :src="info.info.avatarUrl"></image>
					</view>
					<view>{{info.info.nickName}}<text>({{info.info.message}})</text></view>
				</view>
				<view class="f_five">
					<view class="f_four">会员账号：<span>{{info.info.mobile}}</span></view>
					<view class="f_four">直推人数：<span>{{info.info.drive_num}}人</span></view>
					<view class="f_four">间推人数：<span>{{info.info.under_num}}人</span></view>
					<view class="f_four">当日流水：<span>{{info.info.today_total_price}}</span></view>
					<view class="f_four">7日内收益：<span>{{info.info.week_earnings}}</span></view>
					<view class="f_four">本月奖励：<span>{{info.info.month_award}}</span></view>
					<view class="f_four">上月奖励：<span>{{info.info.last_month_award}}</span></view>
					<view class="f_four">累计奖励：<span>{{info.info.total_month_award}}</span></view>
					<view class="f_four">注册时间：<span>{{info.info.create_time}}</span></view>
				</view>
				<view class="r_nine">
					<view class="r_nine_two"  @click="goPage('charge?member_id='+info.info.member_id)">代充</view>
					<view class="r_nine_two" @click="goPage('direct?member_id='+info.info.member_id)">团队管理</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				member_id:'',
				info:{}
			}
		},
		onLoad(e) {
			if(e.member_id){
				this.member_id = e.member_id
			}
			this.getData()
		},
		methods: {
			getData(){
				this.request('/team/memberInfo', {
					member_id: this.member_id
				}).then(res => {
					this.info = res.data.data
				})
			},
			zhitui(e){
				uni.navigateTo({
					url:'dpush?member_id='+e
				})
			},
			goPage(url){
				uni.navigateTo({
					url:url
				})
			}
		}
	}
</script>

<style lang="scss">
	.f_one{
		margin-top: 20rpx;
		background-color: white;
		border-radius: 10rpx;
		.r_nine {
			display: flex;
			justify-content: flex-end;
		    padding: 20rpx;
			.r_nine_two {
				width: 140rpx;
				height: 60rpx;
				line-height: 60rpx;
				text-align: center;
				color: white;
				font-size: 24rpx;
				background: #1D9AF6;
				border-radius: 10rpx;
				margin-left: 20rpx;
				&:nth-of-type(2){
					background: #FDA82E;
				}
			}
		}
		.f_five{
			border-bottom: 1rpx solid #f8f8f8;
			padding-bottom: 24rpx;
			margin: 0 20rpx;
			.f_four{
				margin-top: 24rpx;
				letter-spacing: 5rpx;
				>span{
					font-size: 30rpx;
					color: #FE564C;
				}
			}
		}
		
		.r_five {
			display: flex;
			align-items: center;
			height: 104rpx;
			border-bottom: 1rpx solid #f8f8f8;
			padding: 0 20rpx;
			.five_img {
				width: 43rpx;
				height: 43rpx;
				margin-right: 20rpx;
				border-radius: 50%;
			}
		
			>view {
				&:nth-of-type(2) {
					font-size: 28rpx;
					text{
						color: #FF3A37;
					}
				}
			}
		}
	}
	.v_one{
		background: linear-gradient(0deg, #F63C3C 0%, #FF756B 100%);
		border-radius: 10rpx;
		display: flex;
		justify-content: space-around;
		align-items: center;
		height: 150rpx;
		margin: 20rpx 3% 0;
		.v_two{
			display: flex;
			flex-direction: column;
			justify-content: center;
			width: 235rpx;
			text-align: center;
			
			>view{
				&:first-of-type{
					color: white;
					font-weight: 600;
					font-size: 32rpx;
					text-align: center;
				}
				&:nth-of-type(2){
					color: white;
					font-size: 24rpx;
					text-align: center;
					margin-top: 15rpx;
				}
			}
		}
	}
    page{
		background-color: #F5F5F5
	}
</style>
